<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <title>Document</title>
    <script src="./vue.global.js"></script>
    <link rel="stylesheet" href="./index.css" />
    <link rel="stylesheet" href="./table.css" />
    <link rel="stylesheet" href="./pugong.css" />
    <link rel="stylesheet" href="./utils.css" />
    <script src="./index.full.js"></script>

    <script>
      //适配代码
      (function (doc, win) {
        var docEI = doc.documentElement,
          resizeEvt = "orientationchange" in window ? "orientataionchange" : "resize",
          recalc = function () {
            var clientWidth = docEI.clientWidth;
            if (!clientWidth) return;
            //100是字体大小，1536是开发时浏览器窗口的宽度，等比计算
            docEI.style.fontSize = 100 * (clientWidth / 1536) + "px";
          };

        if (!doc.addEventListener) return;
        win.addEventListener(resizeEvt, recalc, false);
        doc.addEventListener("DOMContentLoaded", recalc, false);
      })(document, window);
    </script>
    <style>
      * {
        /* margin: 0;
        padding: 0; */
        font-size: 0.25rem;
      }
    </style>
  </head>

  <body>
    <div id="app" class="table-content">
      <h3 style="font-size: 0.25rem">项目级安全教育记录</h3>
      <div class="table-form">
        <el-form ref="dataForm" :model="projectEduForm" label-width="138px" class="dataForm">
          <el-row>
            <el-row style="width: 100%">
              <el-col :span="24">
                <el-row style="border-bottom: 1px solid">
                  <el-col :span="24" style="text-align: left; padding-left: 10px"> 教育内容： </el-col>
                </el-row>
                <el-row>
                  <el-col :span="24" style="text-align: left; padding: 5px">
                    <div class="text-indent mb-5px" style="font-weight: 600">一、本项目工作环境、工程特点及危险因素</div>
                    <div class="text-indent mb-5px">介绍项目的工程概况、施工特点和项目所在的地理位置，地形特点、工地外围的环境、居民、交通等及现场存在的危险因素。</div>
                    <div class="text-indent mb-5px" style="font-weight: 600">二、可能遭受的职业伤害和伤亡事故</div>
                    <div class="text-indent mb-5px">1、可能造成的职业病</div>
                    <div class="text-indent mb-5px">(1)水泥尘肺、(2)电焊尘肺、(3)苯中毒、(4)中暑、(5)手臂震动病、(6)电光性皮炎、(7)电光性眼炎、（8）白内障、(9)噪声致聋。</div>
                    <div class="text-indent mb-5px">2、可能造成的伤亡事故</div>
                    <div class="text-indent mb-5px">伤亡事故是指职工在劳动过程中发生的人身伤害、急性中毒，即职工在本岗位劳动或虽不在本岗位劳动，但由于企业的设备和设施不安全、劳动条件和作业环境不良、管理不善及企业领导指派到企业外从事本企业活动中发生的人身伤害(轻伤、重伤、死亡)和急性中毒事件。</div>
                    <div class="text-indent mb-5px" style="font-weight: 600">三、岗位安全职责、操作技能及强制性标准</div>
                    <div class="text-indent mb-5px">1.岗位安全职责</div>
                    <div class="text-indent mb-5px">详见本手册《安全纪律承诺书》。</div>
                    <div class="text-indent mb-5px">2.岗位安全操作技能及强制性标准</div>
                    <div class="text-indent mb-5px">结合本工种岗位特点选择有针对性的安全操作技能及强制性标准进行培训。</div>
                    <div class="text-indent mb-5px" style="font-weight: 600">四、安全设备设施、个人防护用品的使用和维护</div>
                    <div class="text-indent mb-5px">1.安全设备设施必须随施工进度进行安装和搭设。</div>
                    <div class="text-indent mb-5px">2.安全设备设施使用过程中必须严格遵守安全操作规程。</div>
                    <div class="text-indent mb-5px">3.每日班前班后应对安全设备设施的完整性和性能进行检查，检查发现故障或问题不能处理的，应及时报告管理人员。</div>
                    <div class="text-indent mb-5px">4.施工场所的安全防护设施因施工需要拆除的，必须报项目部管理人员同意后，做好警戒措施后方可拆除，施工完成后立即恢复，严禁随意拆除防护设施或挪作他用。</div>
                    <div class="text-indent mb-5px" style="font-weight: 600">五、劳动纪律及安全注意事项</div>
                    <div class="text-indent mb-5px">1.进入施工现场必须戴好安全帽，系好帽带，凡是在2m以上(含2m)高处作业必须系好五点式安全带，要高挂低用。</div>
                    <div class="text-indent mb-5px">2.进入现场施工的人员必须经过安全培训教育和体检，合格后方可上岗。</div>
                    <div class="text-indent mb-5px">3.每日施工前必须参加班前教育，并按照项目部要求进行打卡，方可进场作业。</div>
                    <div class="text-indent mb-5px">4.进入现场的施工人员必须穿戴项目部统一购买的劳动保护服装，并正确合格的安全防护用品</div>
                    <div class="text-indent mb-5px">5.从事特种作业的施工人员必须持合格的专业资格证件。</div>
                    <div class="text-indent mb-5px">6.严禁穿凉鞋、拖鞋、高跟鞋或带钉的鞋或短裤进入施工现场。</div>
                    <div class="text-indent mb-5px">7.施工现场严禁在吸烟点以外的位置吸烟、打闹,严禁酒后进入施工现场。</div>
                    <div class="text-indent mb-5px">8.严禁私自切断或堵塞施工消防通道,不准随意在道路上施工。</div>
                    <div class="text-indent mb-5px">9.安全设施不完善,禁止施工。</div>
                  </el-col>
                </el-row>
                <el-row>
                  <el-col :span="12">
                    <el-form-item label="主讲人" prop="" class="formItemDuty" style="display: flex; align-items: center">
                      <div class="formItemDutyIn" style="width: 100%; height: 0.36rem">
                        <!-- <el-input class="formItemDutyIn" v-show="!projectEduForm.person" style="height: 0.36rem;"></el-input> -->
                        <el-image class="sign_img2" v-show="projectEduForm.speakerSign" :src="projectEduForm.speakerSign" fit="fill"></el-image>
                      </div>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item label="受教育人" prop="" class="formItemDuty" style="display: flex; align-items: center" @click="setUpEquipment('projectEduForm.eiSign','TaskSignFinger')">
                      <div class="formItemDutyIn" style="width: 100%; height: 0.36rem">
                        <!-- <el-input class="formItemDutyIn" v-show="!projectEduForm.person" style="height: 0.36rem;"></el-input> -->
                        <el-image class="sign_img2" v-show="projectEduForm.eiSign" :src="projectEduForm.eiSign" fit="fill"></el-image>
                      </div>
                    </el-form-item>
                  </el-col>
                </el-row>
                <el-row>
                  <el-col :span="24">
                    <el-form-item label="受教育时间" prop="" class="formItemDuty" style="display: flex; align-items: center">
                      <div class="formItemDutyIn" style="width: 100%; height: 0.36rem; line-height: 0.36rem">
                        <el-input v-model="projectEduForm.syear" @input="onInput($event,'syear')" class="people-input" placeholder=" " style="width: 0.8rem"></el-input>
                        年
                        <el-input v-model="projectEduForm.smonth" @input="onInput($event,'smonth')" class="people-input" placeholder=" " style="width: 0.5rem"></el-input>
                        月
                        <el-input v-model="projectEduForm.sday" @input="onInput($event,'sday')" class="people-input" placeholder=" " style="width: 0.5rem"></el-input>
                        日
                        <span style="margin: 0 10px">至</span>
                        <el-input v-model="projectEduForm.eyear" @input="onInput($event,'eyear')" class="people-input" placeholder=" " style="width: 0.8rem"></el-input>
                        年
                        <el-input v-model="projectEduForm.emonth" @input="onInput($event,'emonth')" class="people-input" placeholder=" " style="width: 0.5rem"></el-input>
                        月
                        <el-input v-model="projectEduForm.eday" @input="onInput($event,'eday')" class="people-input" placeholder=" " style="width: 0.5rem"></el-input>
                        日
                      </div>
                    </el-form-item>
                  </el-col>
                </el-row>
              </el-col>
            </el-row>
          </el-row>
        </el-form>
      </div>
    </div>
    <script>
      const { createApp, reactive, toRefs, ref, onMounted } = Vue;
      const vue3Composition = {
        setup() {
          const projectEduForm = ref({
            speakerSign: "", // 主讲人
            eiSign: "", // 受教育人
            syear: "",
            smonth: "",
            sday: "",
            eyear: "",
            emonth: "",
            eday: "",
          });

          window.setSign = (event) => {
            projectEduForm.value[event.key] = event.img;
          };

          window.getData = (event) => {
            return projectEduForm.value;
          };
          window.setData = (data) => {
            // 左边  当天-4
            const today = new Date();
            // 复制日期对象以避免修改原始日期
            const pastDate = new Date(today);
            // 减去4天
            pastDate.setDate(today.getDate() - 4);
            projectEduForm.value.syear = pastDate.getFullYear().toString();
            projectEduForm.value.smonth = String(pastDate.getMonth() + 1).padStart(2, "0"); // 月份从0开始，需+1并补零
            projectEduForm.value.sday = String(pastDate.getDate()).padStart(2, "0"); // 日期补零
            // 右边 当天-3
            const cpastDate = new Date(today);
            cpastDate.setDate(today.getDate() - 3);
            projectEduForm.value.eyear = cpastDate.getFullYear().toString();
            projectEduForm.value.emonth = String(cpastDate.getMonth() + 1).padStart(2, "0");
            projectEduForm.value.eday = String(cpastDate.getDate()).padStart(2, "0");
            projectEduForm.value.speakerSign =
              "";
          };
          const onInput = (e, key) => {
            window.parent.postMessage(
              {
                key,
                isFill: e != "",
                form: "projectEduForm",
              },
              "*"
            );
          };
          const setUpEquipment = (key, type) => {
            window.parent.childListener({
              key,
              type,
            });
          };
          return {
            projectEduForm,
            setUpEquipment,
            onInput,
          };
        },
      };
      const app = createApp(vue3Composition).use(ElementPlus).mount("#app");
    </script>
  </body>
</html>
